<template>
  <section class="my-level">
    <div class="inner">
        <div class="user-level">
          <header class="title">
            红粉宝宝用户等级说明
          </header>
          <table class="level-table">
            <thead>
              <tr>
                <th class="title">称号</th>
                <th class="level">等级</th>
                <th class="ex">经验值</th>
                <th class="icon">图标</th>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td rowspan="5">
                  <img src="../../../assets/img/level1.png" alt="level">
                </td>
                <td>Lv.1</td>
                <td>0-50</td>
                <td><img src="../../../assets/img/1.1.png" alt="level"></td>
              </tr>
              <tr>
                <td>Lv.2</td>
                <td>51-100</td>
                <td><img src="../../../assets/img/1.2.png" alt="level"></td>
              </tr>
              <tr>
                <td>Lv.3</td>
                <td>101-150</td>
                <td><img src="../../../assets/img/1.3.png" alt="level"></td>
              </tr>
              <tr>
                <td>Lv.4</td>
                <td>151-200</td>
                <td><img src="../../../assets/img/1.4.png" alt="level"></td>
              </tr>
              <tr>
                <td>Lv.5</td>
                <td>201-251</td>
                <td><img src="../../../assets/img/1.5.png" alt="level"></td>
              </tr>
              <tr style="background-color: #ebfaff">
                <td rowspan="5">
                  <img src="../../../assets/img/level2.png" alt="level">
                </td>
                <td>Lv.1</td>
                <td>251-500</td>
                <td><img src="../../../assets/img/2.1.png" alt="level"></td>
              </tr>
              <tr style="background-color: #ebfaff">
                <td>Lv.2</td>
                <td>501-1000</td>
                <td><img src="../../../assets/img/2.2.png" alt="level"></td>
              </tr>
              <tr style="background-color: #ebfaff">
                <td>Lv.3</td>
                <td>1001-2000</td>
                <td><img src="../../../assets/img/2.3.png" alt="level"></td>
              </tr>
              <tr style="background-color: #ebfaff">
                <td>Lv.4</td>
                <td>2001-5000</td>
                <td><img src="../../../assets/img/2.4.png" alt="level"></td>
              </tr>
              <tr style="background-color: #ebfaff">
                <td>Lv.5</td>
                <td>5001-10,000</td>
                <td><img src="../../../assets/img/2.5.png" alt="level"></td>
              </tr>

              <tr style="background-color: #fffce9">
                <td rowspan="5">
                  <img src="../../../assets/img/level3.png" alt="level">
                </td>
                <td>Lv.1</td>
                <td>10,001-20,000</td>
                <td><img src="../../../assets/img/3.1.png" alt="level"></td>
              </tr>
              <tr style="background-color: #fffce9">
                <td>Lv.2</td>
                <td>20,001 - 50,000</td>
                <td><img src="../../../assets/img/3.2.png" alt="level"></td>
              </tr>
              <tr style="background-color: #fffce9">
                <td>Lv.3</td>
                <td>50,001-100,000</td>
                <td><img src="../../../assets/img/3.3.png" alt="level"></td>
              </tr>
              <tr style="background-color: #fffce9">
                <td>Lv.4</td>
                <td>100,001-200,000</td>
                <td><img src="../../../assets/img/3.4.png" alt="level"></td>
              </tr>
              <tr style="background-color: #fffce9">
                <td>Lv.5</td>
                <td>200,001-500,000</td>
                <td><img src="../../../assets/img/3.5.png" alt="level"></td>
              </tr>

              <tr style="background-color: #ffeff0">
                <td rowspan="5">
                  <img src="../../../assets/img/level4.png" alt="level">
                </td>
                <td>Lv.1</td>
                <td>500,001-1,000,000</td>
                <td><img src="../../../assets/img/4.1.png" alt="level"></td>
              </tr>
              <tr style="background-color: #ffeff0">
                <td>Lv.2</td>
                <td>1,000,001-2,000,000</td>
                <td><img src="../../../assets/img/4.2.png" alt="level"></td>
              </tr>
              <tr style="background-color: #ffeff0">
                <td>Lv.3</td>
                <td>2,000,001-5,000,000</td>
                <td><img src="../../../assets/img/4.3.png" alt="level"></td>
              </tr>
              <tr style="background-color: #ffeff0">
                <td>Lv.4</td>
                <td>5,000,001-10,000,000</td>
                <td><img src="../../../assets/img/4.4.png" alt="level"></td>
              </tr>
              <tr style="background-color: #ffeff0">
                <td>Lv.5</td>
                <td>10,000,001-20,000,000</td>
                <td><img src="../../../assets/img/4.5.png" alt="level"></td>
              </tr>

              <tr style="background-color: #fff2f9">
                <td rowspan="5">
                  <img src="../../../assets/img/level5.png" alt="level">
                </td>
                <td>Lv.1</td>
                <td>20,000,001-50,000,000</td>
                <td><img src="../../../assets/img/5.1.png" alt="level"></td>
              </tr>
              <tr style="background-color: #fff2f9">
                <td>Lv.2</td>
                <td>50,000,001-100,000,000</td>
                <td><img src="../../../assets/img/5.2.png" alt="level"></td>
              </tr>
              <tr style="background-color: #fff2f9">
                <td>Lv.3</td>
                <td>100,000,001-200,000,000</td>
                <td><img src="../../../assets/img/5.3.png" alt="level"></td>
              </tr>
              <tr style="background-color: #fff2f9">
                <td>Lv.4</td>
                <td>200,000,001-500,000,000</td>
                <td><img src="../../../assets/img/5.4.png" alt="level"></td>
              </tr>
              <tr style="background-color: #fff2f9">
                <td>Lv.5</td>
                <td>500,000,001-1,000,000,000</td>
                <td><img src="../../../assets/img/5.5.png" alt="level"></td>
              </tr>
            </tbody>
          </table>
          <div style="height: 15px"></div>
          <header class="title">
            红粉宝宝用户经验加分规则
          </header>
          <p style="margin: 15px">
            <span class="pink">每日经验值</span> 加分规则
          </p>
          <table class="level-table">
            <thead>
            <tr style="background-color: #eff0f2">
              <th >序号</th>
              <th >项目</th>
              <th >经验值</th>
              <th >每日上限</th>
            </tr>
            </thead>
            <tbody>
            <tr>
              <td>1</td>
              <td>发布日记</td>
              <td>+1</td>
              <td>无上限</td>
            </tr>
              <tr>
                <td>2</td>
                <td>发布帖子</td>
                <td>+1</td>
                <td>无上限</td>
              </tr>
              <tr>
                <td>3</td>
                <td>参与评论</td>
                <td>+1</td>
                <td>30</td>
              </tr>
              <tr>
                <td>4</td>
                <td>回复帖子</td>
                <td>+1</td>
                <td>30</td>
              </tr>
              <tr>
                <td>5</td>
                <td>每日签到</td>
                <td>+4</td>
                <td>每日一次</td>
              </tr>
              <tr>
                <td>6</td>
                <td>分享</td>
                <td>+20</td>
                <td>无上限</td>
              </tr>
              <tr>
                <td>7</td>
                <td>帖子设为"精华帖"</td>
                <td>+50</td>
                <td>无上限</td>
              </tr>
              <tr>
                <td>8</td>
                <td>帖子被喜欢</td>
                <td>+3</td>
                <td>无上限</td>
              </tr>
              <tr>
                <td>9</td>
                <td>日记被喜欢</td>
                <td>+3</td>
                <td>无上限</td>
              </tr>
              <tr>
                <td>10</td>
                <td>回帖被赞</td>
                <td>+3</td>
                <td>20</td>
              </tr>
            </tbody>
          </table>
          <p style="margin: 15px">
            <span class="pink">一次性经验值</span> 加分规则
          </p>
          <table class="level-table">
            <thead>
            <tr style="background-color: #eff0f2">
              <th >序号</th>
              <th >项目</th>
              <th >经验值</th>
              <th >说明</th>
            </tr>
            </thead>
            <tbody>
            <tr>
              <td>1</td>
              <td>完善个人资料</td>
              <td>+10</td>
              <td>首次完善赠送</td>
            </tr>
            <tr>
              <td>2</td>
              <td>App Store给红粉好评</td>
              <td>+20</td>
              <td>仅以此</td>
            </tr>
            <tr>
              <td>3</td>
              <td>首次创建回复日历</td>
              <td>+20</td>
              <td>首次创建则送</td>
            </tr>
            <tr>
              <td>4</td>
              <td>首次添加日历医院</td>
              <td>+20</td>
              <td>再次修改不赠送</td>
            </tr>
            <tr>
              <td>5</td>
              <td>首次添加日历医生</td>
              <td>+20</td>
              <td>再次修改不赠送</td>
            </tr>
            <tr>
              <td>6</td>
              <td>首次添加日历费用</td>
              <td>+20</td>
              <td>再次修改不赠送</td>
            </tr>
            <tr>
              <td>7</td>
              <td>日历-首次公开帖子</td>
              <td>+6</td>
              <td>首次赠送</td>
            </tr>
            <tr>
              <td>8</td>
              <td>日历-首次私密帖子</td>
              <td>+1</td>
              <td>首次赠送</td>
            </tr>
            <tr>
              <td>9</td>
              <td>修改帖子私密到公开</td>
              <td>+5</td>
              <td>首次赠送</td>
            </tr>
            <tr>
              <td>10</td>
              <td>参加活动</td>
              <td>活动规则定</td>
              <td>一次性</td>
            </tr>
            </tbody>
          </table>
          <header class="title" style="margin: 15px 0">
            红粉宝宝用户经验扣除规则
          </header>
          <table class="level-table">
            <thead>
            <tr style="background-color: #eff0f2">
              <th >序号</th>
              <th >项目</th>
              <th >经验值</th>
              <th >说明</th>
            </tr>
            </thead>
            <tbody>
            <tr>
              <td>1</td>
              <td>删除日记</td>
              <td>-10</td>
              <td>无上限</td>
            </tr>
            <tr>
              <td>2</td>
              <td>删除帖子</td>
              <td>-1</td>
              <td>无上限</td>
            </tr>
            <tr>
              <td>3</td>
              <td>APP Store 给好评，上传图片后被后台驳回</td>
              <td>-20</td>
              <td>仅一次</td>
            </tr>
            </tbody>
          </table>
          <p>用户经验值总则：每个用户每日增加经验值无上限，扣除经验值无限制。</p>
          <header class="title" style="margin: 15px 0 0">
            红粉宝宝用户经验扣除规则
          </header>
          <table class="level-table">
            <thead>
            <tr style="background-color: #eff0f2">
              <th >图标</th>
              <th >称号</th>
              <th >描述</th>
            </tr>
            </thead>
            <tbody>
            <tr>
              <td>
                <img src="../../../assets/img/offical.png" alt="icon">
              </td>
              <td>红粉官方</td>
              <td>红粉官方发布消息通知账号</td>
            </tr>
            <tr>
              <td><img src="../../../assets/img/star.png" alt="icon"></td>
              <td>红粉达人</td>
              <td>红粉活跃达人，乐于分享</td>
            </tr>
            <tr>
              <td><img src="../../../assets/img/edu.png" alt="icon"></td>
              <td>红粉老师</td>
              <td>红粉签约明星老师</td>
            </tr>
            <tr>
              <td><img src="../../../assets/img/auther.png" alt="icon"></td>
              <td>认证医院、医生</td>
              <td>提交认证医院、医生相关资质材料， 人工审核后，成为认证医院、医生。</td>
            </tr>
            </tbody>
          </table>
        </div>
    </div>
  </section>
</template>

<script>
import MsgItem from '@/components/ListItem/MsgItem'
export default {
  name: 'MyLevel',
  components: {
      MsgItem
  },
   data () {
      return {

      }
   },
    created () {
    },
    methods: {
    },
    filters: {
      status (status) {
          let s
          switch (status) {
              case 1:
                  s = '已支付'
                  break
              case 2:
                  s= '未支付'
                  break
              default:
                  s = '无状态'
          }
          return s
      },
      tradeStatus (status) {
            let s
            switch (status) {
                case 1:
                    s = '退款成功'
                    break
                case 2:
                    s= '等待确认收货'
                    break
                case 3:
                    s= '退款处理中'
                    break
                case 4:
                    s= '交易成功'
                    break
                case 5:
                    s= '交易关闭'
                    break
                case 6:
                    s= '等待对方发货'
                    break
                default:
                    s = '无状态'
            }
            return s
        }
    }
}
</script>

<style lang="less" scoped>
  @import "../../../style/style.less";
  .my-level {
    border: 1px solid @border-color;
    border-top: 3px solid @theme-color-dark;
    padding: 15px 50px;
    .user-level {
      header {
        padding: 0 20px;
        height: 45px;
        line-height: 45px;
        font-size: 16px;
        color: @theme-color-dark;
        background-color: @theme-color-light;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
      }
      table,table tr th, table tr td { border:1px solid @border-color}
      table {text-align: center; border-collapse: collapse;}
      .level-table {
        width: 100%;
        thead tr{
          height: 48px;
          line-height: 48px;
        }
        tbody tr td {
          text-align: center;
          height: 46px;
          line-height: 46px;
          img {
            display: inline-block;
            vertical-align: middle;
          }
        }
        .title {
          width: 186px;
        }
        .level {
          width: 64px;
        }
        .ex {
          width: 244px;
        }
        .icon {
          width: 100px;
        }
      }
    }
  }
</style>
